<template>
  <view> </view>
</template>
<script>
var barcode = null
var backVew = null
var content = null
var scanBarVew = null
export default {
  data() {
    return {
      flash: false //是否打开摄像头
    }
  },
  onLoad(d) {
    // #ifdef APP-PLUS
    var pages = getCurrentPages()
    var page = pages[pages.length - 1]
    var currentWebview = page.$getAppWebview()
    // #endif
    // #ifdef H5
    var currentWebview = plus.webview.currentWebview()
    // #endif
    plus.navigator.setFullscreen(true) //全屏
    this.createBarcode(currentWebview) //创建二维码窗口
    this.createView(currentWebview) //创建操作按钮及tips界面
  },
  methods: {
    // 扫码成功回调
    onmarked(type, result) {
      let typeName = 'EAN: '
      switch (type) {
        case plus.barcode.QR:
          typeName = 'QR'
          break
        case plus.barcode.EAN13:
          typeName = 'EAN13'
          break
        case plus.barcode.EAN8:
          typeName = 'EAN8'
          break
      }
      uni.navigateBack({
        delta: 1
      })
      if (uni.getStorageSync('scan-init-val')) {
        // 返回时带出之前的数据
        const target = JSON.parse(uni.getStorageSync('scan-init-val'))
        uni.$emit('result-code', {
          initVal: target,
          type: typeName,
          result
        })
        uni.removeStorageSync('scan-init-val')
      } else {
        uni.$emit('result-code', {
          type: typeName,
          result
        })
      }
      console.log({
        type: typeName,
        result
      })
      this.handleBackPress()
    },
    // 创建二维码窗口
    createBarcode(currentWebview) {
      barcode = plus.barcode.create(
        'barcode',
        [
          plus.barcode.QR,
          plus.barcode.EAN8,
          plus.barcode.EAN13,
          plus.barcode.UPCA,
          plus.barcode.UPCE,
          plus.barcode.CODABAR,
          plus.barcode.CODE39,
          plus.barcode.CODE93,
          plus.barcode.CODE128,
          plus.barcode.ITF
        ],
        {
          top: '0',
          left: '0',
          width: '100%',
          height: '100%',
          scanbarColor: '#00BEBE',
          position: 'static',
          frameColor: '#00BEBE'
        }
      )
      barcode.onmarked = this.onmarked
      barcode.setFlash(this.flash)
      currentWebview.append(barcode)
      barcode.start()
    },
    // 创建操作按钮
    createView(currentWebview) {
      // 创建返回原生按钮
      backVew = new plus.nativeObj.View(
        'backVew',
        {
          top: '0px',
          left: '0px',
          height: '40px',
          width: '100%'
        },
        [
          {
            tag: 'img',
            id: 'backBar',
            src: '_www/img/backBar.png',
            position: {
              top: '10px',
              left: '10px',
              width: '40px',
              height: '40px'
            }
          }
        ]
      )
      // 创建打开手电筒的按钮
      scanBarVew = new plus.nativeObj.View(
        'scanBarVew',
        {
          top: '62%',
          left: '40%',
          height: '10%',
          width: '20%'
        },
        [
          {
            tag: 'img',
            id: 'scanBar',
            src: '_www/img/scanBar.png',
            position: {
              width: '20%',
              left: '40%',
              height: '50%'
            }
          },
          {
            tag: 'font',
            id: 'font',
            text: '轻触照亮',
            textStyles: {
              size: '12px',
              color: '#ffffff'
            },
            position: {
              width: '80%',
              left: '10%',
              top: '17%'
            }
          }
        ]
      )

      content = new plus.nativeObj.View(
        'content',
        {
          top: '0px',
          left: '0px',
          height: '100%',
          width: '100%'
        },
        [
          {
            tag: 'font',
            id: 'scanTitle',
            text: '扫码',
            textStyles: {
              size: '20px',
              color: '#ffffff'
            },
            position: {
              top: '10px',
              left: '0px',
              width: '100%',
              height: '40px'
            }
          }
        ]
      )
      var temp = this
      backVew.interceptTouchEvent(true)
      scanBarVew.interceptTouchEvent(true)
      currentWebview.append(content)
      currentWebview.append(scanBarVew)
      currentWebview.append(backVew)
      backVew.addEventListener(
        'click',
        function (e) {
          //返回按钮
          uni.navigateBack({
            delta: 1
          })
          if (uni.getStorageSync('scan-init-val')) {
            // 返回时带出之前的数据
            const target = JSON.parse(uni.getStorageSync('scan-init-val'))
            uni.$emit('result-code', {
              initVal: target
            })
            uni.removeStorageSync('scan-init-val')
          }
          temp.handleBackPress()
        },
        false
      )
      scanBarVew.addEventListener(
        'click',
        function (e) {
          //点亮手电筒
          temp.flash = !temp.flash
          if (temp.flash) {
            scanBarVew.draw([
              {
                tag: 'img',
                id: 'scanBar',
                src: '_www/img/scanBar-flash.png',
                position: {
                  width: '20%',
                  left: '40%',
                  height: '50%'
                }
              },
              {
                tag: 'font',
                id: 'font',
                text: '轻触照亮',
                textStyles: {
                  size: '12px',
                  color: '#ffffff'
                },
                position: {
                  width: '80%',
                  left: '10%',
                  top: '17%'
                }
              }
            ])
          } else {
            scanBarVew.draw([
              {
                tag: 'img',
                id: 'scanBar',
                src: '_www/img/scanBar.png',
                position: {
                  width: '20%',
                  left: '40%',
                  height: '50%'
                }
              },
              {
                tag: 'font',
                id: 'font',
                text: '轻触照亮',
                textStyles: {
                  size: '12px',
                  color: '#ffffff'
                },
                position: {
                  width: '80%',
                  left: '10%',
                  top: '17%'
                }
              }
            ])
          }
          if (barcode) {
            barcode.setFlash(temp.flash)
          }
        },
        false
      )
    },
    handleBackPress() {
      // #ifdef APP-PLUS || H5
      // 返回时退出全屏
      barcode.close()
      backVew.clear()
      scanBarVew.clear()
      content.clear()
      plus.navigator.setFullscreen(false)
      // #endif
    }
  },
  onUnload() {
    plus.navigator.setFullscreen(false)
  }
}
</script>

<style scoped>
</style>
